<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style>
            .d1{
                width: 300px;
                height: 300px;
                background-color: skyblue;
                margin: 0 auto;
            }
            .d1:hover{
                box-shadow: 0 0 10px rgb(156, 201, 219);
            }
        </style>
    </head>
    <body>
        <div class="d1"></div>
        <script>
                //1.点击div两秒后变成粉色
                let d1 = document.querySelector(".d1");
                // d1.addEventListener("click",function(){
                //     let that = this;
                //     setTimeout(function(){
                //         // d1.style.background = "pink";
                //         that.style.background = "pink";
                //     },2000);
                // })
                
                d1.addEventListener("click", function () {
                        setTimeout(()=>{
                            this.style.background = "pink";
                        }, 2000);
                    });

                //2.从数组中返回偶数的元素
                    const a = [2,3,5,8,100];
                    // const result = a.filter(function(item){
                    //     if(item%2===0){
                    //         return true;
                    //     }else{
                    //         return false;
                    //     }
                    // });

                    const result = a.filter(item=> item % 2 === 0);
                    console.log(result);

        </script>
    </body>
</html>